<template>
	<w-dailog v-model="dialogVisible" width="1200px" :title="title" heightFullscreen>
		<w-app-container direction="row" class="fx-page-first-container">
			<div class="tree-container" v-if='hasTree'>
				<fxTree :treeData="copyTreeData" @node-click="nodeClick"></fxTree>
			</div>
			<w-table
        ref="multipleTable"
				:listData="copyTableData"
				:tableColumn="columns"
				:showPagination="false"
				:showColumnFilterBtn="false"
				minWidth="100px"
				:listTotal="copyTableData.length || 0">
			</w-table>
		</w-app-container>
		<template slot="footer">
			<el-button @click="onCancelClick">取消</el-button>
			<el-button type="primary" @click="onSaveClickAdd" v-if='canAdd'>增量复制</el-button>
			<el-button type="primary" @click="onSaveClick">复制</el-button>
		</template>
	</w-dailog>
</template>
<script>
import fxTree from '@/components/common/Fx-tree.vue'
export default {
	name: 'fx-copy',
	components: {
		fxTree
	},
	props: {
		hasTree: {
			type: Boolean,
			default: false
		},
		copyTableData: {
			type: Array,
			default: () => {
				return []
			}
		},
		copyTreeData: {
			type: Array,
			default: () => {
				return []
			}
		},
		columns: {
			type: Array,
			default: () => {
				return []
			}
		},
		canAdd: {
			type: Boolean,
			default: true
		},
		title: {
			type: String,
			default: '复制关系'
		}
	},
	data () {
		return {
			dialogVisible: false
		}
	},
	methods: {
		open () {
			this.dialogVisible = true
		},
		nodeClick (data, node) {
			this.$emit('on-nodeClick', data, node)
		},
		onSaveClick () {
			// 如果没有选择 就提示
			const _selData = this.$refs.multipleTable.selectedRowArr
			this.$emit('on-copysave', _selData, 1)
		},
		onSaveClickAdd () {
			// 如果没有选择 就提示
			const _selData = this.$refs.multipleTable.selectedRowArr
			this.$emit('on-copysave', _selData, 2)
		},
		onCancelClick () {
			this.dialogVisible = false
		}
	}
}
</script>
<style lang="stylus" scoped>
@import '~$assets/stylus/varsty.styl'
.tree-container {
	display: flex
}
</style>
